
<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <!--头部信息-->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BUI | 小呆导航</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
<!-- zui -->
<link rel="shortcut icon"  type="image/x-icon" href="/favicon.png">
<link rel="stylesheet" href="https://cdn.bootcss.com/zui/1.8.1/css/zui.min.css">
<link href="/css/style.css" rel="stylesheet">
<link href="/css/media.css" rel="stylesheet">
<link href="/css/font-awesome.min.css" rel="stylesheet">

  </head>
  <body>
    <!--[if lt IE 8]>
    <div class="alert alert-danger">您正在使用 <strong>过时的</strong> 浏览器. 是时候 <a href="http://browsehappy.com/">更换一个更好的浏览器</a> 来提升用户体验.</div>
    <![endif]-->
    <!--头部导航条-->
    <header>
      
<div class="main">
<h1 class="logo">
  <a href="/index.html">
    <img src="/images/logo.png">
    <span>小呆导航</span>
  </a>
</h1>
<nav class="nav">
  <ul>
    <!--获取导航链接/从首页向下第一个栏目起/只显示nav栏目组-->
    <li><a href="/channels/2.html">教程资源</a></li><li><a href="/channels/3.html">高清图库</a></li><li><a href="/channels/4.html">软件下载</a></li><li><a href="/channels/5.html">个人博客</a></li><li><a href="/channels/6.html">在线留言</a></li><li><a href="/channels/149.html">友情链接</a></li><li><a href="/channels/332.html">关于本站</a></li>
  </ul>
</nav>
<div class="head-btn visible-lg">
  <a href="javascript:;" class="sethome" data-toggle="tooltip" data-placement="bottom" title="设为首页" onclick="setHome(this,window.location);"><i class="fa fa-home"></i></a>
  <a href="javascript:;" class="customize" data-toggle="tooltip" data-placement="bottom" title="自定义模式"><i class="fa fa-cog"></i></a>
  <a href="javascript:;" class="theme" data-toggle="tooltip" data-placement="bottom" title="更换主题"><i class="fa fa-image"></i></a>
  <a href="/v1/index.html" target="_blank" data-toggle="tooltip" data-placement="bottom" title="切回旧版"><i class="fa fa-refresh"></i></a>
  <a href="javascript:;" id="submit_URL" data-toggle="tooltip" data-placement="bottom" title="网址提交"><i class="fa fa-pencil-square-o"></i></a>
</div>
<button class="bar-btn visible-xs visible-sm">
  <span class="icon-bar bar-line1"></span>
  <span class="icon-bar bar-line2"></span>
</button>
<button class="nav-btn visible-xs visible-sm">
  <span class="icon-line top"></span>
  <span class="icon-line middle"></span>
  <span class="icon-line bottom"></span>
</button>
</div>

    </header>
    <div id="content">
      <!--导航条-->
      <div class="mask"></div>
      <div class="left-bar">
        <div class="header"><h2>导航目录</h2></div>
        <nav class="menu" data-ride="menu">
          <ul id="treeMenu" class="tree tree-menu" data-ride="tree">
            <li>
                <a href="/web.html"><i class="fa fa-html5"></i>前端开发</a>
                <ul>
                  <!--从首页向下循化3级栏目列表：0为首页-->
                  <!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-1"><i class="fa fa-video-camera"></i>视频教程</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-2"><i class="fa fa-book"></i>在线学习</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-3"><i class="fa fa-puzzle-piece"></i>碎片学习</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-4"><i class="fa fa-wrench"></i>学习工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-5"><i class="fa fa-server"></i>WEB公共库</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-6"><i class="fa fa-users"></i>前端组织/团队</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-7"><i class="fa fa-commenting"></i>社区/论坛</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-8"><i class="fa fa-magnet"></i>前端框架 - UI</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-9"><i class="fa fa-file-code-o"></i>前端框架 - JS</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-10"><i class="fa fa-paper-plane"></i>前端插件</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-11"><i class="fa fa-tablet"></i>移动框架</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-12"><i class="fa fa-hourglass-2"></i>预处理器</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-13"><i class="fa fa-font"></i>字体图标</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-14"><i class="fa fa-cogs"></i>构建工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-15"><i class="fa fa-cubes"></i>模块加载</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-16"><i class="fa fa-briefcase"></i>包管理器</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-17"><i class="fa fa-dashboard"></i>模板引擎</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-18"><i class="fa fa-gamepad"></i>游戏引擎</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-19"><i class="fa fa-sun-o"></i>代码高亮</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-20"><i class="fa fa-github"></i>代码托管</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-21"><i class="fa fa-wordpress"></i>博客系统</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-22"><i class="fa fa-jsfiddle"></i>域名/服务器</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-23"><i class="fa fa-paperclip"></i>辅助工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-24"><i class="fa fa-flag"></i>站长工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-25"><i class="fa fa-photo"></i>图片素材</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-26"><i class="fa fa-thumbs-o-up"></i>精选酷站</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-27"><i class="fa fa-globe"></i>互联网资讯</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-28"><i class="fa fa-suitcase"></i>工作/私单</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/web.html#row-29"><i class="fa fa-cloud-download"></i>应用程序</a></li>
                </ul>
              </li><li>
                <a href="/ui.html"><i class="fa fa-dribbble"></i>界面设计</a>
                <ul>
                  <!--从首页向下循化3级栏目列表：0为首页-->
                  <!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-1"><i class="fa fa-graduation-cap"></i>学习教程</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-2"><i class="fa fa-lightbulb-o"></i>灵感采集</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-3"><i class="fa fa-tv"></i>界面交互</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-4"><i class="fa fa-briefcase"></i>在线工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-5"><i class="fa fa-flag"></i>icon图标</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-6"><i class="fa fa-magic"></i>设计素材</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-7"><i class="fa fa-photo"></i>图库素材</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-8"><i class="fa fa-tint"></i>颜色搭配</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/ui.html#row-8"><i class="fa fa-font"></i>字体字形</a></li>
                </ul>
              </li><li>
                <a href="/cg.html"><i class="fa fa-youtube-play"></i>影视后期</a>
                <ul>
                  <!--从首页向下循化3级栏目列表：0为首页-->
                  <!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-1"><i class="fa fa-graduation-cap"></i>学习教程</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-2"><i class="fa fa-magic"></i>特效动画</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-3"><i class="fa fa-comments"></i>资讯交流</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-4"><i class="fa fa-cloud-download"></i>软件插件</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-5"><i class="fa fa-camera-retro"></i>摄影摄像</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/cg.html#row-6"><i class="fa fa-folder-open"></i>素材资源</a></li>
                </ul>
              </li><li>
                <a href="/offlce.html"><i class="fa fa-keyboard-o"></i>日常办公</a>
                <ul>
                  <!--从首页向下循化3级栏目列表：0为首页-->
                  <!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-1"><i class="fa fa-fire"></i>热门推荐</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-2"><i class="fa fa-dashboard"></i>效率资源</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-3"><i class="fa fa-graduation-cap"></i>技能提升</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-4"><i class="fa fa-wrench"></i>在线工具</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-5"><i class="fa fa-users"></i>团队协作</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-6"><i class="fa fa-envelope"></i>电子邮箱</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-7"><i class="fa fa-book"></i>文案策划</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-7"><i class="fa fa-file-word-o"></i>文档模板</a></li><!--获取栏目的icon图标类名和栏目标题/图标类名字段在“设置管理”中添加-->
                    <li><a href="/offlce.html#row-8"><i class="fa fa-desktop"></i>工作兼职</a></li>
                </ul>
              </li>
          </ul>
        </nav>
        <div class="menu-about">
          <p>工作 / 学习 / 生活 / 网址导航</p>
          <p>@小呆导航 V2.0</p>
        </div>
      </div>
      <!--内容-->
      <div class="main">
        <div class="container mainContent">
          
<section class="sousuo">
<div class="container">
  <div class="row">
    <div class="col-md-12">
      <form class="sousuo-form" name="f" action="https://www.baidu.com/s" target="_blank">
        <div id="Select">
          <div class="Select-box hidden-xs">
            <ul>
              <li class="this_s">百 度</li>
              <li class="baidu_s">百 度</li>
              <li class="google_s">谷 歌</li>
              <li class="bing_s">必 应</li>
              <li class="haosou_s">好 搜</li>
              <li class="sougou_s">搜 狗</li>
            </ul>
          </div>
          <input type="text" name="wd" id="input" maxlength="100" autocomplete="off">
          <div class="qingkong" id="qingkong" title="清空">x</div>
        </div>
        <button id="so-btn"><i class="icon icon-search visible-xs"></i><span class="hidden-xs">搜 索</span></button>
      </form>
    </div>
  </div>
</div>
</section><!--搜索栏-->
          <!--
          <section class="item card-box" id="row-1">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>视频教程</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.howzhi.com/channel/IT-internet" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d783b03661151a61.png">好知网 - IT互联网</img></div>
                          <div class="card-desc">好知网是一个综合性在线学习平台，有大量的在线课程，部分课程收费&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.yun.lu" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/714fd14ba24c4f05.png">云路课堂</img></div>
                          <div class="card-desc">专业的职业技能学习平台，免费课程很多。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.ycku.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/71cd3036659ca229.png">瓢城Web俱乐部</img></div>
                          <div class="card-desc">一个不错的在线视频教程网站，部分教程还在持续更新中。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://chuanke.baidu.com/course/72351176527446016.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/e98eea5c069dfabb.jpg">百度传课 - 编程语言</img></div>
                          <div class="card-desc">百度推出的教育领域新兴在线教育平台，免费视频教程很丰富，基本都是免费的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://ke.qq.com/course/list?mt=1001" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/fade5e1bbefe8d99.jpg">腾讯课程 - IT·互联网</img></div>
                          <div class="card-desc">腾讯推出的专业在线教育平台，采用直播教学方式，适合有充裕时间学习的同学。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://study.163.com/category/it" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/79beca65ce8bc119.png">网易云课程 - 编程开发</img></div>
                          <div class="card-desc">网易旗下实用技能学习平台，内容非常丰富，免费教程也挺多的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jirengu.com/app/album/index" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/9461d14d54e6841d.jpg">饥人谷</img></div>
                          <div class="card-desc">一家收费的前端开发线上培训机构，虽然课程收费，但是官网还是有挺多免费教程视频的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.zhaikexueyuan.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/5f6091b78dfddbc1.jpg">宅客学院</img></div>
                          <div class="card-desc">IT职业教育线上品牌，课程涵盖大数据、前端开发、后端开发等，免费课程挺多的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.jikexueyuan.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/842106729c4621e7.jpg">极客学院</img></div>
                          <div class="card-desc">一家很不错的IT职业在线教育平台，入门教程视频通俗易懂，很适合新手学习。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.imooc.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/12477e879c32ff6.jpg">慕课网</img></div>
                          <div class="card-desc">程序员的梦工厂，慕课网是垂直的互联网IT技能免费学习网站。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-2">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>在线学习</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://css.doyoe.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f5b427abbed05fca.jpg">CSS参考手册</img></div>
                          <div class="card-desc">Web前端开发人员提供最新、最全的CSS中文版在线资料，涵盖CSS3参考手册。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://reactnative.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/47fc7088c3dbd852.jpg">React Native中文网</img></div>
                          <div class="card-desc">React Native中文网是中国最大的React Native开发者交流学习平台, 致力于打造React Native开发。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.aseoe.com/special/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5c06d5e35de51dda.jpg">爱思资源网</img></div>
                          <div class="card-desc">专注web前端开发与php编程设计，是一个专业技术交流、资源共享的web前端开发工程师平台&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.gbtags.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3a4f5a034876dc86.jpg">极客标签</img></div>
                          <div class="card-desc">极客标签是一个基于web的在线极客编程知识分享&学习平台，能够帮助你快速高效地学习代码编程并方便的在线实时分享编程技巧和心得。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://dwqs.gitbooks.io/frontenddevhandbook/content/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a1c0c6cf257d2d3c.jpg">前端开发者手册</img></div>
                          <div class="card-desc">这是任何人都可以用来学习前端的实践手册, 它概述并讨论了前端工程的实践。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://li-xinyang.gitbooks.io/frontend-notebook/content/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9e8ff587cd31ebd8.jpg">前端开发笔记本</img></div>
                          <div class="card-desc">《前端笔记本》涵盖了 Web 前端开发所需的全部基本知识以及所对应的学习路径。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://developer.mozilla.org/zh-CN/docs/Learn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d423f5847e9667b9.png">Mozilla 开发者网络</img></div>
                          <div class="card-desc">一个完整的学习平台，你可以在这里深入学习网络技术以及能够驱动网络的软件</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.css88.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8d3e38a022e4c9c8.png">WEB前端开发</img></div>
                          <div class="card-desc">一个前端开发技术和前端开发资讯的专业博客，专注前端开发，关注用户体验。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.w3cways.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/7547849854582437.jpg">W3Cways</img></div>
                          <div class="card-desc">Web前端学习之路，网站提供很丰富的相关技术中文文档。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.hubwiz.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/b02c4c6d67862318.jpg">汇智网</img></div>
                          <div class="card-desc">汇智网是一个学习最前沿编程技术的平台，提供了node.js、js、jq等相关的课程。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.runoob.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/b7e82395f78d6d4b.png">菜鸟教程</img></div>
                          <div class="card-desc">学的不仅是技术，更是梦想&#65281;该站提供了很全的编程技术基础教程，适合入门学习。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.w3school.com.cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/f1fec4b71457dfd3.jpg">w3school</img></div>
                          <div class="card-desc">领先的免费 Web 技术教程，在 w3school，你可以找到你所需要的所有的网站建设教程。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-3">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>碎片学习</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://vuefe.cn/v2/guide/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1367967c8e558233.png">Vue.js中文文档</img></div>
                          <div class="card-desc">Vue是一套构建用户界面&#40;user interface&#41;的渐进式框架，与其他重量级框架不同的是，Vue 从根本上采用最小成本、渐进增量的设计。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://easings.net/zh-cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b6c331c467dd03ac.png">缓动函数速查表</img></div>
                          <div class="card-desc">缓动函数指定动画效果在执行时的速度，使其看起来更加真实. 本页可以在每次你需要时，帮助你找到想要的缓动函数。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.hewebgl.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e72b7d8b6999c3e4.png">WebGL中文网</img></div>
                          <div class="card-desc">国内最好、最系统的WebGL教程网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.zhangxinxu.com/jq/stylus/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/73468ef8a56720af.png">Stylus中文文档</img></div>
                          <div class="card-desc">张鑫旭 - stylus中文版参考文档之综述</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.bootcss.com/p/lesscss/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/a2750823b5c82838.png">Less教程</img></div>
                          <div class="card-desc">Bootstrap推出的Less中文教程</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://nec.netease.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/92664fcfb80ba4b6.png">NEC(CSS规范)</img></div>
                          <div class="card-desc">NEC包括了规范、框架、代码库、插件等内容，致力于为前端开发人员提供高效率高质量的前端页面开发解决方案。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.ctolib.com/javascript.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/6e8bdda418fac627.png">JavaScript开发社区</img></div>
                          <div class="card-desc">各种有关JS教程及开源项目，如果你感兴趣，还可以浏览器该站其他内容，如PHP、JAVA开发等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.lvtao.net/content/book/node.js.htm" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/caa3b227baad960e.jpg">七天学会NodeJS</img></div>
                          <div class="card-desc">阿里国际站前端技术部写的一个博文，如果有耐心读完，相信还是有不少收获的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://css3clickchart.com/#box-sizing" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/c5d51725c4b8cf93.png">CSS Click Chart</img></div>
                          <div class="card-desc">可以查询到目前CSS3草案部分的相关属性</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://daneden.github.io/animate.css/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/f960fbc8f72aaa35.jpg">Animate动画库</img></div>
                          <div class="card-desc">各种Animate动画案例，可以直接预览效果，如果你稍微会点Animate知识，可以试着去读源代码，帮助自己提高Animate技能</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://browserhacks.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/afc5cbcb824cc5d9.png">浏览器hack大全</img></div>
                          <div class="card-desc">由于不同的浏览器，对CSS的解析认识不一样，因此会导致生成的页面效果不一样，于是就有了针对不同的浏览器写不同的CSS code，这就叫CSS hack</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-4">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>学习工具</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://zhibimo.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/467e57a0bba6d69a.png">知笔墨</img></div>
                          <div class="card-desc">知笔墨可以使用Markdown格式与Git版本控制工具来进行图书的编写、构建与发布工作，同时还提供了在线编辑器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.kancloud.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/60a4606079b1d01e.png">看云</img></div>
                          <div class="card-desc">看云专注于文档的在线创作、协作、分享和托管服务，致力于提供最佳的在线创作和阅读体验,让企业和个人可以更方便地发布和管理自己的文档。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.gitbook.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/4b9e68253a43ce9a.png">GitBook</img></div>
                          <div class="card-desc">GitBook 是一个基于 Node.js 的命令行工具，可使用 Github/Git 和 Markdown 来制作精美的电子书。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://codepen.io/pen" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/5fb617fb23cff988.png">CodePen</img></div>
                          <div class="card-desc">CodePen是浏览器中的HTML，CSS和JavaScript代码编辑器，可即时预览查看和编写您的代码。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://jsfiddle.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8f76df04afe27a23.png">JSFiddle</img></div>
                          <div class="card-desc">一个老牌的在线JS代码调试工具，支持javascript、css、html代码可视化在线调试工具,支持多种应用多种主流框架,用起来非常方便</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jsbin.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/e43efa9fd4d43c37.png">JS Bin</img></div>
                          <div class="card-desc">一个在线网站代码调试工具，主要用于测试 JavaScript 和 CSS 的代码片段的Web 应用，拥有简单的操作界面和全面的测试环境。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-5">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>WEB公共库</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://www.awesomes.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/df3464494acf97c1.jpg">Awesomes</img></div>
                          <div class="card-desc">Web前端开发工程师需要的免费开源的高质量前端库、框架和插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jscdn.upai.com/?spm=a2c4e.11155515.0.0.kf06Hb" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/76d6ac7d8bfee713.jpg">又拍云CDN</img></div>
                          <div class="card-desc">又拍云JS库加速服务，你可以在自己的网页上直接通过script标记引用这些资源。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://docs.microsoft.com/en-us/aspnet/ajax/cdn/overview" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/9f09d5ccb0a47177.jpg">微软CDN</img></div>
                          <div class="card-desc">微软公司提供的公共CDN服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://libs.useso.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/a505584985d49fd7.png">360DNS</img></div>
                          <div class="card-desc">360网站卫士常用前端公共库CDN服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cdnjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/59623ce0c3041e2f.png">cdnjs</img></div>
                          <div class="card-desc">最全的CDN公用库, 速度不是太稳定。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.staticfile.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/49e12d0792585b8c.png">Staticfile CDN</img></div>
                          <div class="card-desc">为开源库提供稳定、快速的免费 CDN 服务，类似于CDNJS，非常推荐。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.bootcdn.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/c250ebcf1766d7aa.png">BootCDN</img></div>
                          <div class="card-desc">稳定、快速、免费的开源项目 CDN 服务，共收录了 3300&#43; 开源项目。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://cdn.code.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/388ae4bfd809a498.jpg">百度静态资源公共库</img></div>
                          <div class="card-desc">稳定，快速，全面，开源的国内CDN加速服务。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-6">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>前端组织/团队</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://taobaofed.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/36997f196fe55e7.png">Taobao FED</img></div>
                          <div class="card-desc">淘宝前端团队，用技术为体验提供无限可能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://75team.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a226b6446ed75e94.png">奇舞团</img></div>
                          <div class="card-desc">奇虎360公司Web平台部前端工程师 &#43; 部分特约嘉宾 组成的一个前端团队。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://qqfe.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f935a819c22713ee.png">腾讯网FERD</img></div>
                          <div class="card-desc">FERD &#8212; 腾讯网前端研发中心</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.alloyteam.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a05672f987b64bbd.png">AlloyTeam</img></div>
                          <div class="card-desc">来自于腾讯SNG&#40;社交网络事业群&#41;，是主要负责腾讯Q&#43;、WebQQ、QQ群空间项目的团队，致力于Web前端技术的研究。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://imweb.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c1f8bfef07722db2.jpg">腾讯IMWeb</img></div>
                          <div class="card-desc">IMWEB团队主要负责腾讯课堂，多人社交互动视频以及活动组织类项目的研发工作。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://efe.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ee6c0b86eef19cb8.png">百度EFE</img></div>
                          <div class="card-desc">百度EFE技术体系，前身是ECOM前端团队，后经过技术的发展，逐渐形成一套完善的前端技术体系。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://fex.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8a26940195565f71.png">百度FEX</img></div>
                          <div class="card-desc">FEX 是百度Web 前端研发部的别名，是社区基础技术部中的前端团队。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jsconf.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/85a5beb6112b18d9.png">JSConf</img></div>
                          <div class="card-desc">JavaScript中国开发者大会&#40;JSConf China&#41;是一个围绕 JS 开发者为中心的活动。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://feexp.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/273e79050aab72d.png">前端体验大会</img></div>
                          <div class="card-desc">互联网前端业界一个交流会组织，旨在推动互联网前端web技术在中国的发展，致力于为同行从业者提供一个分享和交流的平台，提升从业者的影响力及技术能力储备。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.w3.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/31ea9216167fbc8f.jpg">万维网联盟W3C</img></div>
                          <div class="card-desc">万维网联盟创建于1994年，是Web技术领域最具权威和影响力的国际中立性技术标准机构。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-7">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>社区/论坛</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://aotu.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ca8836c22f744873.png">Aotu.io「凹凸实验室」</img></div>
                          <div class="card-desc">凹凸实验室&#40;Aotu.io&#41; 始建于2015年，是一个年轻基情的技术社区组织。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.ibm.com/developerworks/cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ac0b9d3b88608193.jpg">developerWork</img></div>
                          <div class="card-desc">IBM 的官方开发者项目，在这里你可以访问和下载试用版软件，查找丰富的 IT 技术资源&#40;文章、教程、视频和代码等&#41;,和专业的 IT 从业人员交流。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.daqianduan.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d41490fb046ac65d.png">大前端</img></div>
                          <div class="card-desc">大前端是一个关注前端开发、用户体验设计、HTML5、CSS3、Javascript的前端开发独立博客。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://finalshares.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/fec1c414cf59b10c.png">极分享</img></div>
                          <div class="card-desc">高质分享&#43;专业互助=没有难做的软件&#43;没有不得已的加班；因为分享，所以简单&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="/contents/77/432.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e30d7274ca9bb76e.gif">深度开源</img></div>
                          <div class="card-desc">收录最全、最新的开源软件/开源项目，发掘开源价值,发布最新IT资讯，提供开发文档，技术经验分享。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.oschina.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/bd9898603e900b7b.jpg">开源中国</img></div>
                          <div class="card-desc">开源中国是目前中国最大的开源技术社区，我们传播开源的理念，推广开源项目，为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cnodejs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b47e2ed2372691ea.png">CNode</img></div>
                          <div class="card-desc">CNode 社区为国内最专业的 Node.js 开源技术社区，致力于 Node.js 的技术研究。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.v2ex.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/45cc75299bf8f76c.jpg">V2EX</img></div>
                          <div class="card-desc">一个汇集各类奇妙好玩的话题和流行动向的网站，V2EX 提供了特别有用的小工具 &#91; ZEN &#93;，帮助你掌握自己的时间。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://laravel-china.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8d53bb883900905f.jpg">Laravel China</img></div>
                          <div class="card-desc">一个高品质的 Laravel 开发者社区，致力于为 Laravel 和 PHP 开发者提供一个分享创造、结识伙伴、协同互助的论坛。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://segmentfault.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a678dd8b0c37b1d5.jpg">SegmentFault</img></div>
                          <div class="card-desc">中国领先的开发者技术社区，我们希望为编程爱好者提供一个纯粹、高质的技术交流的平台, 与开发者一起学习、交流与成长。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.w3ctech.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b0b4b70ba581c47b.png">w3ctech</img></div>
                          <div class="card-desc">w3ctech创立于2009年10月，是中国最大的前端技术社区。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://juejin.im/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f65b5b05e672317f.png">掘金</img></div>
                          <div class="card-desc">掘金是一个帮助开发者成长的社区，是给开发者用的 Hacker News，给设计师用的 Designer News，和给产品经理用的 Medium。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-8">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>前端框架 - UI</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://www.blazeui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cbcc912d8a9a23fd.png">Blaze CSS</img></div>
                          <div class="card-desc">开放源码的模块化CSS工具包，为建立网站提供了很好的结构。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://adminlte.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b7c6d2f52a2487c8.png">AdminLTE</img></div>
                          <div class="card-desc">一个非常流行的基于 Bootstrap 3.x 免费后台UI框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://aliqin.github.io/atui/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e2eeeee050bce6.png">Atui</img></div>
                          <div class="card-desc">阿里通讯前端部推出的一个基于 Vue.js 2.0 的 UI 组件库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cloudflare.github.io/cf-ui/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/551643c01180e5f8.png">Cf-ui</img></div>
                          <div class="card-desc">Cloudflare 开发的一个 Web UI 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://elemental-ui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3bec012098d5c74.png"> Elemental UI</img></div>
                          <div class="card-desc">一个针对 React.js 的灵活的、漂亮的 UI 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://ant.design/index-cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/502c611eee6ce9d6.png"> Ant Design</img></div>
                          <div class="card-desc">一个服务于企业级产品的设计体系，基于&#12302;确定&#12303;和&#12302;自然&#12303;的设计价值观，通过模块化的解决方案，让设计者专注于更好的用户体验。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.pintuer.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7fea2adec812d6a.jpg">拼图Pintuer</img></div>
                          <div class="card-desc">拼图是优秀的响应式前端CSS开源框架，国内前端框架先驱及领导者，自动适应手机、平板、电脑等设备，让前端开发像游戏般快乐、简单、灵活、便捷。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.zui.sexy/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3cb50940d34e1148.png">ZUI</img></div>
                          <div class="card-desc">一个基于 Bootstrap 深度定制开源前端实践方案，帮助你快速构建现代跨屏应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://sui.taobao.org/sui/docs/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/987490dd9d94d94a.png">SUI</img></div>
                          <div class="card-desc">SUI 是一套基于bootstrap开发的前端组件库，同时她也是一套设计规范。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="/contents/37/440.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/df04ed962d511c9c.png">BUI</img></div>
                          <div class="card-desc">BUI是基于jQuery，兼容KISSY的UI类库，专致于解决后台系统的框架方案。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://bootflat.github.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6f63611bb745ca72.png">Bootflat</img></div>
                          <div class="card-desc">Bootflat - 基于bootstrap 3.2.0 的扁平化风格的UI组件的开源项目。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.getuikit.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/15f6834c3a546326.png">UIKit中文网</img></div>
                          <div class="card-desc">UIkit是YOOtheme团队开发的一款轻量级、模块化的前端框架，可快速构建强大的前端web界面。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://ccforward.github.io/rubik/#/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d3148eda6079f984.png">Rubik UI</img></div>
                          <div class="card-desc">Rubik UI 是一个基于 Vue.js 2.0&#43; 的开源 UI 组件库，在交互和视觉设计上遵循 Material Design 规范，适用于 PC 端和 mobile 端。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.layui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8c90a8c835f2a1a5.jpg">Layui</img></div>
                          <div class="card-desc">Layui 是一款采用自身模块规范编写的情怀型前端UI框架，遵循原生HTML/CSS/JS的书写与组织形式，门槛极低，拿来即用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.jeasyui.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/3c6dbce53f4733cb.png">Jquery EasyUI中文网</img></div>
                          <div class="card-desc">easyui是一种基于jQuery的用户界面插件集合。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jqueryui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/ab8da1da027f1cfb.gif">jQuery UI</img></div>
                          <div class="card-desc">jQuery UI 是建立在 jQuery JavaScript 库上的一组用户界面交互、特效、小部件及主题。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://semantic-ui.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/f2fe8864ffff8dc9.png">Semantic UI中文官方网站</img></div>
                          <div class="card-desc">Semantic 是一个用来帮助创建漂亮、响应化、人性化的开发框架</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://foundation.zurb.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/cb5292cba7645837.png">Foundation</img></div>
                          <div class="card-desc">Foundation 是一个易用、强大而且灵活的框架,用于构建基于任何设备上的 Web 应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://v3.bootcss.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/147cc14799fd6749.jpg">Bootstrap</img></div>
                          <div class="card-desc">最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-9">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>前端框架 - JS</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://redom.js.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/edadbb921d866f26.png">Redom</img></div>
                          <div class="card-desc">一个轻便的创建用户接口的 JavaScript 库，测试覆盖率100&#37;。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.css88.com/doc/backbone/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cf28f4a5ba247e5b.png">Backbone.js</img></div>
                          <div class="card-desc">给你的 JS 应用一些Backbone的模型、视图、集合和事件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://d3js.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/37109e4bb67e2d4a.png">D3</img></div>
                          <div class="card-desc">D3.js是一个基于数据处理文档，针对 HTML 和 SVG 的 JavaScript 可视化库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jslite.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b22b1071310ebe05.png">JSLite</img></div>
                          <div class="card-desc">JSLite是正对现代浏览器的一个主要的兼容jQuery的API简约的JavaScript库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://thinkjs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6e9dc02b01e68a9.png">ThinkJS</img></div>
                          <div class="card-desc">ThinkJS 是一款使用 ES6/7 特性全新开发的 Node.js MVC 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://eggjs.org/zh-cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/67c92aa6384b8fa3.png">Egg</img></div>
                          <div class="card-desc">一个用于更好地构建企业应用的框架，内置流程管理，高度可定制，有强大的插件系统。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://docs.kissyui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8ec072fa61037f1d.png">KISSY</img></div>
                          <div class="card-desc">KISSY 是一款跨终端、模块化、高性能、使用简单的 JavaScript 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cn.vuejs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/86c6ca7942dabaf5.png">Vue.js 中文网</img></div>
                          <div class="card-desc">Vue.js 是一个用于创建 Web 交互界面的库，它让你通过简单而灵活的 API 创建由数据驱动的 UI 组件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://doc.react-china.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/cdc2d49e875b0915.jpg">React.js中文网</img></div>
                          <div class="card-desc">用于构建用户界面的 JavaScript 库，React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.angularjs.net.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/55c0271adefb7aa5.jpg">Angular.js中文网</img></div>
                          <div class="card-desc">AngularJS是为了克服HTML在构建应用上的不足而设计的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.jquery123.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/12c3ebb7fb02ef75.png">jQuery</img></div>
                          <div class="card-desc">jQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-10">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>前端插件</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://interactjs.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/894765d8626032d.png">Interact.js</img></div>
                          <div class="card-desc">interact.js是一个随意改变形状插件，,它非常强大的，灵活拖放，改变大小，支持现代浏览器的多点触摸手势，基于SVG的运用，能运行在包括在IE8&#43;的浏览器</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.hcharts.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/90ff2f9b2f004610.png">Highcharts</img></div>
                          <div class="card-desc">Highcharts 是一个用纯JavaScript编写的一个图表库，兼容IE6&#43;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://blueimp.github.io/jQuery-File-Upload/index.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/9da40e021b3b1658.png">jQuery File Upload Plugin</img></div>
                          <div class="card-desc">一个有功能强大的 jQuery 上传组件，支持多文件选择、拖拽上传、验证、图片和多媒体预览等功能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://rubaxa.github.io/Sortable/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/a4049ec64a5b6b33.jpg">Sortable</img></div>
                          <div class="card-desc">一个简约的 JavaScript 库用于在现代浏览器中拖放列表重新排序 ，支持任何JS框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.qunee.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/7d82d14ea7901279.png">qunee</img></div>
                          <div class="card-desc">一套基于HTML5的网络图组件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.geetest.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/719f577b6a68d4be.jpg">极验验证</img></div>
                          <div class="card-desc">新一代基于行为式验证安全技术的验证码。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.tinymce.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/b7b2bcb6606baaba.png">TinyMCE</img></div>
                          <div class="card-desc">国外一款所见所得富文本web编辑器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://ueditor.baidu.com/website/index.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/878dde9332c72dae.png">UEditor</img></div>
                          <div class="card-desc">UEditor是由百度web前端研发部开发所见即所得富文本web编辑器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://alvarotrigo.com/multiScroll/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/53d7730f5a05e0d7.jpg">multiScroll.js</img></div>
                          <div class="card-desc">创建分割的多滚动页面特效插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://stickerjs.cmiscm.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/2119e177856f82fd.jpg">Sticker.js</img></div>
                          <div class="card-desc">一款仿贴纸效果插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://wlog.cn/waterfall/index-zh.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/b72bfadf9abad6dd.jpg">Waterfall</img></div>
                          <div class="card-desc">一款仿Pinterest网站的响应式无限动态加载图片瀑布流特效jQuery插件</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://validform.rjboy.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/f1144dbe08e0f5a6.jpg">Validform</img></div>
                          <div class="card-desc">表单验证插件，一行代码搞定整站的表单验证。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://datatables.club/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/94bfd964ba52a0c3.jpg">Datatables</img></div>
                          <div class="card-desc">Datatables是一款jquery表格插件，它是一个高度灵活的工具，可以将任何HTML表格添加高级的交互功能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://miromannino.github.io/Justified-Gallery/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/21402b7680e1bb01.jpg">Justified Gallery</img></div>
                          <div class="card-desc">Justified Gallery 是一个 jQuery 的相册展示插件，图片会自动填满整个页面空间。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://pawelgrzybek.github.io/siema/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/3c87660e1ef85ab5.jpg">Siema</img></div>
                          <div class="card-desc">轻量级简单的纯 JavaScript 轮播插件，支持触摸手势</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://msurguy.github.io/background-blur/#" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/452a256937ebdf55.jpg">Background-blur</img></div>
                          <div class="card-desc">实用的超轻的跨浏览器的图像模糊 jQuery 插件，基于 SVG 生成，效果很好</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.swiper.com.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/69204ad264a8286f.jpg">Swiper</img></div>
                          <div class="card-desc">Swiper是一个开源、免费强大的纯javascript打造的滑动特效插件，面向手机、平板。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://kushagragour.in/lab/hint/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/69e2033b5b256c95.png">Hint.css</img></div>
                          <div class="card-desc">一款非常小巧的提示框效果插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://echarts.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/e1421fa2cf085ffd.png">EChart</img></div>
                          <div class="card-desc">百度EFE团队出品的可视化图表插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://lokeshdhakar.com/projects/lightbox2/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d8926c9541545e85.png">Lightbox</img></div>
                          <div class="card-desc">以弹框形式集中展示图片的JavaScript库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://layer.layui.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/ab1b9b49a9e9e2f5.png">Layer</img></div>
                          <div class="card-desc">一个让你想到即可做到的web弹窗/层解决方案。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-11">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>移动框架</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://frozenui.github.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/86a9f3aac0a90390.png">Frozen UI</img></div>
                          <div class="card-desc">FrozenUI 是一套基于移动端的UI库 轻量、精美、遵从手机 QQ 设计规范。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.myronliu.com/vue-carbon/#!/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/71647b8212a2f97.jpg">Vue Carbon</img></div>
                          <div class="card-desc"> 一个基于 Vue 开发 material design 风格的移动端 UI 库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.auicss.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/39da5547971c45b8.png">AUI</img></div>
                          <div class="card-desc">移动端UI快速布局解决方案&#65288;APICloud UI框架&#65289;。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/benmajor/jQuery-Touch-Events" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/b097590b85e18ad7.jpg">jQuery Touch Events</img></div>
                          <div class="card-desc">Touch-Events 会自动识别由触摸及点击引起的事件，此插件能够帮助单一环境的 jQuery 移动应用环境的开发。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://vycool.com/Jingle/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/adaa152cd2f01e6a.jpg">Jingle</img></div>
                          <div class="card-desc">Jingle是一个基于html5、css3开发轻量级的移动webapp 框架，提供一些基本交互方式，帮助您更方便的开发移动应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://tinynav.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/5a7fa2e4794fd19d.jpg">Tinynav.js</img></div>
                          <div class="card-desc">一个迷你响应式导航插件，大小只有452B。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/lzxb/flex.css/blob/master/docs/zh-ch.md" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/73f53d28ebba464f.jpg">Flex.css</img></div>
                          <div class="card-desc">flex.css is 是一个声明式的布局框架，能够兼容多个 MVVM框架和浏览器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://mobile.ant.design/index-cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/d3c64881704c8b37.jpg">Ant Design Mobile</img></div>
                          <div class="card-desc">一个基于 Preact / React / React Native 的 UI 组件库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://wangdahoo.github.io/vonic-documents/#/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/162839c3c54978dd.jpg">Vonic</img></div>
                          <div class="card-desc">Vonic 是一个基于 Vue.js 和 Ionic CSS 样式的 UI 框架，用于快速构建移动端单页应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.mobilebone.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/af6c276d3dbde17f.jpg">Mobilebone</img></div>
                          <div class="card-desc">mobile移动端，PC桌面端页面无刷新过场JS骨架，简单、专注&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://chrisyee.ca/pushy/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/17af7daf5f7bb5c6.jpg">Pushy</img></div>
                          <div class="card-desc">Pushy是一种响应式画布导航菜单，使用CSS变换和转换。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/panteng/wechat-h5-boilerplate" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/54e1f0b1077703ea.png">Wechat-h5-boilerplate</img></div>
                          <div class="card-desc">为腾讯微信优化的H5动效模板，帮助你快速构建全屏滚动型H5页面。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://zingchart.github.io/zingtouch/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/260715e32390f794.png">Zingtouch</img></div>
                          <div class="card-desc">一个 JavaScript 触摸手势检测库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://pep.briangonzalez.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/213c412b800ad86f.jpg">Jquery.pep.js</img></div>
                          <div class="card-desc">jquery.pep.js是一个轻量级的jQuery插件，它可以将任何DOM元素成为拖动对象。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://mobiscroll.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/16a3c916a00d6342.png">Mobiscroll</img></div>
                          <div class="card-desc">用于触摸设备&#65288;如智能手机和平板电脑&#65289;的可定制移动UI库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/fex-team/GMU" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/a490e04888531e83.png">GMU</img></div>
                          <div class="card-desc">百度FEX团队推出的基于zepto的ui组件库，适用于移动端。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.muse-ui.org/#/index" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/740b0d056417deed.png">Muse-UI</img></div>
                          <div class="card-desc">基于 Vue 2.0 和 Material Design 的 UI 组件库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://montagestudio.com/montagejs/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/94c947c520dbec02.png">MontageJS</img></div>
                          <div class="card-desc">MontageJS是一个现代化的前端HTML5框架，支持快速创建单页应用程序。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://alloyteam.github.io/AlloyFinger/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/330ba7fcf9f5dd6.png">Alloyfinger</img></div>
                          <div class="card-desc">腾讯Web前端团队推出的轻量级的多点触控手势库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://justspamjustin.github.io/junior/#home" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/73b97806d1360d7.png">Junior</img></div>
                          <div class="card-desc">用于构建具有原生外观的HTML5移动应用的前端框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://getmobicss.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/e28d6af9d5c66f45.png">Mobi.css</img></div>
                          <div class="card-desc">一个轻量级的，可扩展的，移动优先的CSS框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://kornel.ski/slip/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/cc43d9433cde0001.png">Slip</img></div>
                          <div class="card-desc">通过滑动和拖动手势操作列表的 UI 库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/fooplugins/FooTable" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/85cc33931ed2dfeb.png">Footable</img></div>
                          <div class="card-desc">FooTable是一个jQuery插件旨在使更小的设备上的HTML表格看起来真棒，无论你可能有多少列数据。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/soyjavi/QuoJS" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/9fcf918f582e9c2.jpg">Quojs</img></div>
                          <div class="card-desc">针对移动设备的微型JavaScript库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/matthewhudson/current-device" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/fb822e066f4f0aba.jpg">Device.js</img></div>
                          <div class="card-desc">检测设备平台、操作系统的Javascript库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://mozbrick.github.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/2419c3f581731d47.jpg">Brick</img></div>
                          <div class="card-desc">Brick是为易于快速构建Web应用程序UI设计的UI组件的集合。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://onsen.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/c02887cd81aeee4c.png">Onsen UI</img></div>
                          <div class="card-desc">用来构建混合移动端APP的 HTML5 UI 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://mint-ui.github.io/#!/zh-cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/3c057fbe9b98f0ad.png">Mint UI</img></div>
                          <div class="card-desc">基于 Vue.js 的移动端组件库，包含丰富的 CSS 和 JS 组件，能够满足日常的移动端开发需要。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/AlloyTeam/Mars" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/6e941d5d87f1f53a.jpg">Mars</img></div>
                          <div class="card-desc">腾讯移动Web前端知识库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://vux.li/#/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/2c30d7df1b4abe17.jpg">Vux</img></div>
                          <div class="card-desc">基于 WeUI 和 Vue.js 的 移动端 UI 组件库，提供丰富的组件满足移动端&#40;微信&#41;页面常用业务需求。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://nwjs.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/75ded413a5dae85a.png">NW.js</img></div>
                          <div class="card-desc">轻量级跨平台桌面应用开发框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://zeptojs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/981b2fb1a2e3d658.png">Zepto.js</img></div>
                          <div class="card-desc">Zepto是一个轻量级的针对现代高级浏览器的JavaScript库，更偏向于移动端。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://jqweui.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/3fb09235f1bc9663.png">jQuery WeUI</img></div>
                          <div class="card-desc">专为微信公众账号开发而设计的一个简洁而强大的UI库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://m.sui.taobao.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/4532aa5bed665488.png">SUI Mobile</img></div>
                          <div class="card-desc">淘宝的SUI是一款不错的移动端UI库，轻量，小巧且精美。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jquerymobile.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/78ee8c73968a1921.png">jQuery Mobile</img></div>
                          <div class="card-desc">jQuery Mobile 是用于创建移动 Web 应用的前端开发框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://facebook.github.io/react-native/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/19985b4a90bd7227.jpg">React-native</img></div>
                          <div class="card-desc">Facebook推出的一个基于 React 的创建原生APP的框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://dev.dcloud.net.cn/mui/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/5b778024286f5735.png">Mui</img></div>
                          <div class="card-desc">最接近原生APP体验的高性能前端框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://framework7.taobao.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/5d3116c4e7f2726d.png">Framework7</img></div>
                          <div class="card-desc">功能强大的创建 iOS & Android APP 的 HTML 框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://weex-project.io/cn/index.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d7378a39a8abcb3d.png">Weex</img></div>
                          <div class="card-desc">阿里推出的跨平台的移动端开发框架，具有轻量级、可扩展和高性能的特点。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://ionicframework.com.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/1a76f4ded308fd25.jpg">Ionic</img></div>
                          <div class="card-desc">领先的HTML5 移动开发框架和 SDK，利用你所熟知的web 技术构建难以置信的移动应用，是AngularJS最好的朋友。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-12">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>预处理器</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://www.npmjs.com/package/node-sass" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/7eb5a94318c997e.png">Node-sass</img></div>
                          <div class="card-desc">node-sass提供了一个nodejs到libsass的桥梁.libsass是广受欢迎的css预处理器sass的c版本</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/css-modules/css-modules" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/90fc45796a8fdfae.png">CSS Modules</img></div>
                          <div class="card-desc">它不是将 CSS 改造成编程语言，而是功能很单纯，只加入了局部作用域和模块依赖</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://stylus-lang.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/1c2270db6eac446e.png">Stylus</img></div>
                          <div class="card-desc">富有表现力的、动态的、健壮的CSS</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.sass.hk/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/59ca8e6b664df2fe.png">Sass中文网</img></div>
                          <div class="card-desc">世界上最成熟、最稳定、最强大的专业级CSS扩展语言&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://coffeescript.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/188957c62ead0976.png">Coffeescript</img></div>
                          <div class="card-desc">CoffeeScript 是一门编译到 JavaScript 的小巧语言。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://lesscss.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/54c28ce68ab1605e.png">Less 中文网</img></div>
                          <div class="card-desc">Less 是一门 CSS 预处理语言,它扩展了 CSS 语言,增加了变量、Mixin、函数等特性。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-13">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>字体图标</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="/contents/42/192.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/e20d9b61198e9b12.png">Ligature Symbols</img></div>
                          <div class="card-desc">国外一个免费开源字体图标库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://mfglabs.github.io/mfglabs-iconset/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/b5d08b70911c997e.png">MFG Labs icon set</img></div>
                          <div class="card-desc">免费字体图标</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://icomoon.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/7a97ae13d984e2fe.png">IcoMoon</img></div>
                          <div class="card-desc">免费开源的字体图标库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://pictonic.co/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/984e46d641a6992.png">pictonic</img></div>
                          <div class="card-desc">国外一个免费字体图标库，有362个免费字体图标。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://fontawesome.dashgame.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/33003a86650c5076.png">Font Awesome</img></div>
                          <div class="card-desc">一款风靡全球的图标字体库和CSS框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.iconfont.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/b7c91eb2fa151856.jpg">Iconfont</img></div>
                          <div class="card-desc">阿里妈妈MUX打造的图标库，是国内功能很强大且图标内容很丰富的矢量图标库。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-14">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>构建工具</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://github.com/Tencent/tmt-workflow" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/10585e2b11e328f8.jpg">tmt-workflow</img></div>
                          <div class="card-desc">一个基于 Gulp&#40;v4.0&#41;、高效、跨平台&#40;Mac & Win&#41;、可定制的前端工作流程。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://enderjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/e44802356ceec887.jpg">Ender</img></div>
                          <div class="card-desc">一款全功能的浏览器软件包管理器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://slushjs.github.io/generators/#/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/9bd22428b357267e.png">slush</img></div>
                          <div class="card-desc">流式脚手架系统 - 用 Gulp 替换了 Yeoman</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/developit/microbundle" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/8526156af505b305.png">Microbundle</img></div>
                          <div class="card-desc">零配置的模块打包器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://elemefe.github.io/cooking/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/883121e9d23b8b63.png">cooking</img></div>
                          <div class="card-desc">更易上手的前端构建工具，不仅简单而且高效。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://brunch.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/5e3ba7e9ebd23633.png">Brunch</img></div>
                          <div class="card-desc">快速的前端Web应用程序构建工具，具有简单的声明性配置，用于快速开发的无缝增量编译。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://parceljs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/286e5da9c890b577.png">PARCEL中文网</img></div>
                          <div class="card-desc">一个非常快速、零配置的 WEB 应用打包工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/facebook/create-react-app" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/f514e561ff94b89d.png">create-react-app</img></div>
                          <div class="card-desc">无需配置文件快速创建 React 应用</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://weflow.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/ce953393246a485a.png">Weflow</img></div>
                          <div class="card-desc">微信团队推出的跨终端的前端工作流开发工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://fex-team.github.io/fis3/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/4befa414bad19100.png">Fis3</img></div>
                          <div class="card-desc">FIS3 面向前端的工程构建系统。解决前端工程中性能优化、资源加载等问题。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="/contents/43/196.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/6460bf2791072a40.png">Yeoman</img></div>
                          <div class="card-desc">Yeoman提供了自动化开发流程的一整套工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.webpackjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/1ffbcba2a33da8ce.png">Webpack中文网</img></div>
                          <div class="card-desc">Webpack 是一个前端资源加载/打包工具，它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.gruntjs.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/114b0410708fd7e4.png">Grunt中文网</img></div>
                          <div class="card-desc">Grunt是基于Node.js的项目构建工具，它可以自动运行你所设定的任务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.gulpjs.com.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8e1569f52cc6ec7a.jpg">Gulp中文网</img></div>
                          <div class="card-desc">Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-15">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>模块加载</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://github.com/ecomfe/esl" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/f300d38ac03e030b.jpg">ESL</img></div>
                          <div class="card-desc">ESL是一个浏览器端、符合AMD的标准加载器，适合用于现代Web浏览器端应用的入口与模块管理。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/cujojs/curl" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/8194d5e36a2150ab.png">curl</img></div>
                          <div class="card-desc">curl.js 是一个轻量级，快速，可扩展的模块加载器，用来处理AMD，CommonJS模块/ 1.1，CSS，HTML文本，和传统的脚本。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/getify/LABjs" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/e6efef43761b1347.jpg">LABjs</img></div>
                          <div class="card-desc">LABjs是一个动态脚本加载器，旨在用一个灵活的，性能优化的替代API来替代使用丑陋的，非高性能的&#60;script&#62;标签。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://vue-loader.vuejs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/92526ba7582b26ef.jpg">Vue Loader</img></div>
                          <div class="card-desc">Vue.js 组件的 Webpack loader。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/umdjs/umd" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/ed99ddd565e5f3ff.jpg">UMD</img></div>
                          <div class="card-desc">适用于任何地方的JavaScript模块的UMD&#65288;通用模块定义&#65289;模式。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/systemjs/systemjs" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/6f9277421dce134c.jpg">SystemJS</img></div>
                          <div class="card-desc">可配置模块加载器，在浏览器和NodeJS中启用动态ES模块工作流程。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://nodejs.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d12795761d90c30e.png">Nodejs中文网</img></div>
                          <div class="card-desc">Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://moutjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8984d8b363a8f1b0.png">Mout</img></div>
                          <div class="card-desc">MOUT是模块化JavaScript实用程序的集合，可以在浏览器中用作AMD模块或node.js。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://imagesloaded.desandro.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/3b474a9eef24f736.png">Imagesloaded</img></div>
                          <div class="card-desc">imagesLoaded是一个用于来检测网页中的图片是否载入完成JavaScript工具库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.rollupjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/c24579e85cda30d0.jpg">Rollup中文文档</img></div>
                          <div class="card-desc">Rollup 是一个 JavaScript 模块打包器,可以将小块代码编译成大块复杂的代码。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://seajs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/e14b70237886b582.png">Seajs</img></div>
                          <div class="card-desc">SeaJS是一个遵循CMD规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://requirejs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/7b67ded8d2f4da06.png">Requirejs</img></div>
                          <div class="card-desc">RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-16">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>包管理器</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.jamjs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/f1a29508596e5b06.png">Jam</img></div>
                          <div class="card-desc">JavaScript包管理器 - 使用以浏览器为中心并与RequireJS兼容的存储库。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://fuse-box.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/432dc96bce70f5c4.png">FuseBox</img></div>
                          <div class="card-desc">FuseBox是一款快速的捆绑器/模块加载器，您可以以毫秒为单位测量构建时间。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://duojs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/43a22d82a37915ed.png">DUO</img></div>
                          <div class="card-desc">Duo是下一代软件包管理器，融合了Component，Browserify和Go的最佳创意，使组织和编写前端代码快速而轻松。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/componentjs/component" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/1da3e70c98ab8ecf.png">component</img></div>
                          <div class="card-desc">前端程序包管理器和用于模块化Web应用程序的构建工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://lernajs.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/e885ae15b963cdef.png">Lerna</img></div>
                          <div class="card-desc">一个用于管理有多个包的 JavaScript 项目的工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://gugel.io/ied/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/b4819b1c59a8e80e.png">IED</img></div>
                          <div class="card-desc">像npm一样，但速度更快 - 是Node的替代软件包管理器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://jspm.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d35af329ec4440a6.png">Jspm-cli</img></div>
                          <div class="card-desc">JSPM是基于SystemJS的Javascript包 package管理器，基于动态的ES6模块加载器之上构建。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://browserify.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/cd9cfcd74c49a2ca.png">Browserify</img></div>
                          <div class="card-desc">Browserify是一个浏览器端代码模块化工具简介服务器端NodeJS自带模块功能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://bower.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/d75c76a31800d7d2.png">Bower</img></div>
                          <div class="card-desc">bower Bower是一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://yarnpkg.com/zh-Hans/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/8e320f7a18835952.png">Yarn</img></div>
                          <div class="card-desc">Yarn 对你的代码来说是一个包管理器， 你可以通过它使用全世界开发者的代码，或者分享自己的代码。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.npmjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/464c9f11c20e8152.png">Npm</img></div>
                          <div class="card-desc">npm 是 JavaScript 世界的包管理工具,并且是 Node.js 平台的默认包管理工具。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-17">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>模板引擎</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://github.com/Polymer/lit-html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/5cf6f57ce0d251c2.png">lit-html</img></div>
                          <div class="card-desc">JavaScript 中写 HTML 的模板引擎</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/tj/consolidate.js" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/1035791f1fc099eb.jpg">Consolidate.js</img></div>
                          <div class="card-desc">Node.js 模板引擎的集合。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.dustjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/3cef62fbbfcbe20b.jpg">Dust.js</img></div>
                          <div class="card-desc">针对浏览器和服务器的异步Javascript模板。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://rivetsjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/86c9aa6f81d2555f.jpg">Rivets.js</img></div>
                          <div class="card-desc">轻量级和强大的数据绑定&#43;模板解决方案，用于构建现代Web应用程序。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/paularmstrong/swig" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/b7ffa00b7e97f86a.jpg">Swig</img></div>
                          <div class="card-desc">Swig是一个非常棒的 Django/Jinja-like模板引擎，用于node.js。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/tj/ejs" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/e2246164b0d47c59.jpg">EJS</img></div>
                          <div class="card-desc">应用于 Node.js 的嵌入式 JavaScript 模板引擎。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/janl/mustache.js" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/782a521ace522986.jpg">mustache.js</img></div>
                          <div class="card-desc">mustache.js是一种无逻辑模板语法，它可以用于HTML，配置文件，源代码 - 任何东西。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://pugjs.org/api/getting-started.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/820da0a408217999.png">Pug</img></div>
                          <div class="card-desc">Pug 是一款强大，优雅，功能丰富的 Node.js 模板引擎。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="/contents/46/217.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/392155e5e4dfc693.png">Nunjucks</img></div>
                          <div class="card-desc">Nunjucks 是一个更复杂的 JavaScript 模板引擎，提供丰富的语言特性和块继承、自动转移、宏和异步控制等等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://twitter.github.io/hogan.js/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/76011fabf0120bfb.png">Hogan.js</img></div>
                          <div class="card-desc">Hogan是一个非常简单的模板引擎,可以把它理解成Mustuche语法的编译器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://aui.github.io/art-template/zh-cn/index.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/fc479602b2bb658b.png">ART-TEMPLATE</img></div>
                          <div class="card-desc">artTemplate是新一代javascript 模板引擎，它在 v8 中的渲染效率可接近 javascript 性能极限。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://handlebarsjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/432e538937aacab.png">Handlebars.js</img></div>
                          <div class="card-desc">Handlebars.js是一个Javascript客户端的模板引擎&#40;它也能用于服务器端&#41;。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jade-lang.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/2f7e25997d6c3aab.png">JADE LANGUAGE</img></div>
                          <div class="card-desc">Jade是一款基于haml的html模版引擎,采用JavaScript实现,可以方便地在Node.js、Yeoman等框架中使用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://olado.github.io/doT/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/3/6488a05c9aa9b2a8.png">doT.js</img></div>
                          <div class="card-desc">dot.js是一个短小精悍的js模板引擎,压缩版仅有4K大小。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-18">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>游戏引擎</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://github.com/liabru/matter-js" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/8416d7e2700b949e.jpg">Matter.js</img></div>
                          <div class="card-desc">一个 2D 刚体物理引擎。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/gabrielecirulli/2048" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/458d1c0947bd0da4.png">2048</img></div>
                          <div class="card-desc">一个简单的 1024 游戏的复制品。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://impactjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4d8511ffce203524.png">ImpactJS</img></div>
                          <div class="card-desc">ImpactJS是一个基于JavaScript的HTML5游戏引擎,同时支持PC和移动平台浏览器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.cocos.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5b3e796254ee9b7c.jpg">Cocos</img></div>
                          <div class="card-desc">一个基于MIT协议的开源框架，用于构建游戏、应用程序和其他图形界面交互应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://threejs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a815f14260c320ec.png">ThreeJS</img></div>
                          <div class="card-desc">Three.js是当下最流行的网页3D渲染JS引擎,其主要是对WebGL编程以面向对象方式进行的封装。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://phaser.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f76172980704e16c.png">PhaserJS</img></div>
                          <div class="card-desc">Phaser是一款免费开源的PC端和移动端HTML5游戏框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://createjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d7bd8b5faac198de.png">CreateJS</img></div>
                          <div class="card-desc">基于HTML5的一套模块化的库和工具共同工作或独立使丰富的交互式内容的开放式Web技术。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.egret.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/500d798ec5ca83cc.png">白鹭引擎</img></div>
                          <div class="card-desc">白鹭引擎-Egret是一套HTML5游戏开发解决方案。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-19">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>代码高亮</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://microsoft.github.io/monaco-editor/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cf9ba2db67a41f1e.png">Monaco-editor</img></div>
                          <div class="card-desc">一个基于浏览器的代码编辑器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://prismjs.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9c9cf00632bcadce.png">Prism</img></div>
                          <div class="card-desc">一个轻量级的，稳健的，优雅简洁的语法高亮插件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://highlightjs.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/92b1fbef3810a676.png">Highlight.js</img></div>
                          <div class="card-desc">Highlight.js 是一个用 JavaScript 写的代码高亮插件，在客户端和服务端都能工作。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://codemirror.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/be50c8be0e5d3f0a.png">CodeMirror</img></div>
                          <div class="card-desc">CodeMirror 是一个为浏览器定制的全能的文本编辑器，用 JavaScript 实现。专门用来编写代码，支持超过100个语言，以及各种各样的扩展让我们实现更高级的编辑功能。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-20">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>代码托管</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.svnchina.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c0f5bb978ef67736.jpg">SVN China</img></div>
                          <div class="card-desc">为中国广大程序员而创办的SVN源代码托管站,支持Subversion权限管理、版本管理、修订纪录订阅、SVN库备份导入导出等功能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://gitshell.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f6ad368abae1aa8.png">Gitshell</img></div>
                          <div class="card-desc">Gitshell 是一个使用git版本控制系统的项目，类似github，提供clone，push，pull，branch管理等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://about.gitlab.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3c57c7882303493a.jpg">Gitlab</img></div>
                          <div class="card-desc">GitLab 是一个基于 git 的仓库管理程序,也是一个方便软件开发的强大完整应用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://bitbucket.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d181508cb87a2a04.jpg">Bitbucket</img></div>
                          <div class="card-desc">BitBucket 是一家源代码托管网站，采用Mercurial和Git作为分布式版本控制系统。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://git.oschina.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dc2f317b88f646c.jpg">码云</img></div>
                          <div class="card-desc">码云是开源中国社区团队推出的基于Git的快速的、免费的、稳定的在线代码托管平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://code.csdn.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/95f068259e3d6eaa.png">Code</img></div>
                          <div class="card-desc">CSDN是一个面向国内开发者提供代码托管、代码片、社交编程、组织管理、社区讨论、知识库等开发服务平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://coding.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/41b57615cd7248d4.jpg">Coding</img></div>
                          <div class="card-desc">Coding 是一个面向开发者的云端开发平台，目前提供代码托管，运行空间，质量控制，项目管理等功能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://github.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a5e37ff7de953f1a.jpg">GitHub</img></div>
                          <div class="card-desc">github是一款分布式的版本控制系统，是一个面向开源及私有软件项目的托管平台。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-21">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>博客系统</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.dedecms.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/9be484de7dce1a0a.jpg">织梦CMS</img></div>
                          <div class="card-desc">国内开源CMS的领先品牌，目前程序安装量已达七十万。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://typecho.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/97fc814d1842793a.png">Typecho</img></div>
                          <div class="card-desc">一款内核强健&#65105;扩展方便&#65105;体验友好&#65105;运行流畅的轻量级开源博客程序。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.siteserver.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/5/380ab5e2ec13b2fa.png">SiteServer CMS</img></div>
                          <div class="card-desc">中国.NET平台下最强大的企业级开源CMS系统，可免费用于商业用途。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://pages.github.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5d7c29d09a871812.png">GithubPages</img></div>
                          <div class="card-desc">Github Pages是Github免费提供给开发者的一款托管个人网站的产品。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.jekyll.com.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e3bddca79c0728f6.png">Jekyll</img></div>
                          <div class="card-desc">jekyll是一个简单的免费的Blog生成工具，类似WordPress。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://hexo.io/zh-cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1e0015a03faccfd2.png">Hexo</img></div>
                          <div class="card-desc">快速、简洁且高效的博客框架。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.ghostchina.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ab96b50b381a657e.png">Ghost</img></div>
                          <div class="card-desc">Ghost 是基于 Node.js 的开源博客平台，由前 WordPress UI 部门主管 John O’Nolan 和 WordPress 高级工程师&#65288;女&#65289; Hannah Wolfe 创立。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://jpress.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/744e4b0c100f7108.png">JPress</img></div>
                          <div class="card-desc">JPress，一个wordpress的java代替版本，使用JFinal开发。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cn.wordpress.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c94c0ff48ac4e.png">WordPress</img></div>
                          <div class="card-desc">WordPress是使用PHP语言开发的博客平台，用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-22">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>域名/服务器</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://amazonaws-china.com/cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a72df62415940ec2.jpg">亚马逊云</img></div>
                          <div class="card-desc">AWS - 亚马逊公司旗下云计算服务平台，为全世界各个国家和地区的客户提供一整套基础设施和云解决方案。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cn.bluehost.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e5f501f7071c86c2.jpg">Bluehost</img></div>
                          <div class="card-desc">全球第&#9312;主机商，21年主机经验，专业虚拟主机、独立服务器、VPS主机、云主机、域名等服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cn.resellerclub.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dee8331c0bf5072.jpg">ResellerClub(CN)</img></div>
                          <div class="card-desc">ResellerClub-域名主机提供商，19年行业经验，全球域名注册商前十强。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://sg.godaddy.com/zh" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7725ec23ac317032.jpg">GoDaddy</img></div>
                          <div class="card-desc">世界知名互联网域名注册商GoDaddy，业务遍布全球，致力于为中国企业和个人用户提供卓越的网站服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.sudu.cn/domain/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d6c7775065f6f11a.jpg">华夏名网</img></div>
                          <div class="card-desc">华夏名网，成都飞数科技公司旗下之网络服务品牌，创于2002年，乃国内首批具ICP资质之服务商。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.xinnet.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c7106286f892a983.jpg">新网</img></div>
                          <div class="card-desc">24年互联网基础服务运营经验，中国互联网基础服务提供商，一站式网络营销平台，高效便捷&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.ucloud.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/619555bc3ec1efb.png">UCloud</img></div>
                          <div class="card-desc">UCloud是中国领先的中立云计算服务商，也是国家工信部首批认证通过的“可信云”。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.biggeryun.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9576b0639947858b.jpg">比格云</img></div>
                          <div class="card-desc">比格云是专业的云服务提供商,以“更快、更稳、更便捷“的品牌理念,致力于做世界一流高性能云主机。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.cndns.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/36f9c791a6cbeb3b.jpg">美橙互联</img></div>
                          <div class="card-desc">美橙互联-虚拟专用服务器空间提供商和国家cnnic认证四星级注册商。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.west.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/759fc6a040e724f3.jpg">西部数码</img></div>
                          <div class="card-desc">西部数码是基于云计算领先的互联网服务提供商，15年专业知名品牌。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.163yun.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cd6380b5f20a60e3.jpg">网易云</img></div>
                          <div class="card-desc">网易云是网易旗下云计算和大数据品牌，业界领先的高品质场景化云服务和大数据服务商。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.jcloud.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cf232a545e4e059b.jpg">京东云</img></div>
                          <div class="card-desc">京东云以京东在云计算、大数据、物联网等方面的多年技术积淀,为广大用户和个人站长提供稳定、安全、便捷的多种解决方案。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.huaweicloud.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/871cdcb1cb9f4f5b.jpg">华为云</img></div>
                          <div class="card-desc">华为云是华为公司倾力打造的云战略品牌，致力于为全球客户提供领先的公有云服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cloud.tencent.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e44a3d84c7b82fcb.jpg">腾讯云</img></div>
                          <div class="card-desc">腾讯云 - 腾讯公司倾力打造的面向广大企业和个人的公有云平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cloud.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dae73b011a195eab.jpg">百度云</img></div>
                          <div class="card-desc">百度云---百度基于17年技术积累为公有云需求者提供稳定、高可用、可扩展的云计算服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.aliyun.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9222da06ce5bedcc.jpg">阿里云</img></div>
                          <div class="card-desc">阿里云——阿里巴巴集团旗下公司，是全球领先的云计算及人工智能科技公司。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-23">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>辅助工具</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.polaxiong.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/72c267138f889315.png">泼辣修图</img></div>
                          <div class="card-desc">一款免费的在线图像处理软件，只要页面加载完成，导出导入图片不再受网络影响</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://qrohlf.com/trianglify/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d2ab6214eeb8ec02.png">Trianglify</img></div>
                          <div class="card-desc">Trianglify 是一款可以生成漂亮的三角形素材的工具，它还可以生成SVG或者CSS的背景。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://smallpdf.com/cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d0de0f540fe0a9c8.png">Smallpdf</img></div>
                          <div class="card-desc">在线PDF压缩，转换格式的好工具&#65288;压缩率超高&#65289;。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.chuangkit.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6d3d144ff65739c2.png">创客贴</img></div>
                          <div class="card-desc">创客贴是国内首创极简在线平面设计工具，专注在线免费设计图片，素材下载及在线印刷。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://colordrop.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ac256291707e2e70.png">ColorDrop</img></div>
                          <div class="card-desc">colordrop是一个很棒的配色网站，收录了不少漂亮的配色方案，而且选定方案之后便会弹出对应的Hex与RGB色值。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.36zhen.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1260d3e4c61b0178.png">36镇（共享收藏夹）</img></div>
                          <div class="card-desc">一个能在线收藏网址、整理、团队共享网址的收藏夹。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://zhongguose.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/845eb22362ae058e.png">中国色（颜色库）</img></div>
                          <div class="card-desc">供各种中国的传统颜色的名称，CMYK值，RGB值，16进制表示。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.cutterman.cn/zh/cutterman" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7639a3851aabef0e.png">Cutterman</img></div>
                          <div class="card-desc">没错,最好用的切图工具,它是免费的,就是这么任性&#33; 此站很多神器。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.biaonimeia.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ba927961a1d96ab0.png">标你妹啊</img></div>
                          <div class="card-desc">无需下载客户端，自动转换px/dp/pt单位，高效、全自动、免费&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.css3maker.com/css3-transform.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8834aef3c30840f2.png">Css3Maker</img></div>
                          <div class="card-desc">CSS3在线生成器，给你省去很多功夫。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://zaole.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/834a85bf278245fc.jpg">CSS3，H5在线测试</img></div>
                          <div class="card-desc">CSS3-html5在线测试 手机响应式效果。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://tinypng.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/35e3b40398dc5a68.jpg">TinyPNG</img></div>
                          <div class="card-desc">图片压缩网站，支持小于5M的jpg、png图片的压缩。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.browsersync.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f8fd17ef13a14444.png">Browsersync</img></div>
                          <div class="card-desc">省时的浏览器同步测试工具，能让浏览器实时、快速响应您的文件更改并自动刷新页面。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://aeditor.alloyteam.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a41bf14350981642.png">AEditor</img></div>
                          <div class="card-desc">AEditor是一个方便广大web开发者进行H5动画交互页开发的工具</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://tower.im/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/61bd5f2691e39118.png">tower</img></div>
                          <div class="card-desc">项目管理，任务管理，团队协作，项目协作等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://koala-app.com/index-zh.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5e163abb7473416a.png">koala - 编译工具</img></div>
                          <div class="card-desc">koala是一个前端预处理器语言图形编译工具，支持Less、Sass、Compass、CoffeeScript。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://modao.cc/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e088699736bde1b6.png">墨刀</img></div>
                          <div class="card-desc">强大易用的免费移动应用原型与线框图工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://maka.im/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a3385c1c3a8252f2.png">MACA 免费H5页面</img></div>
                          <div class="card-desc">强大的免费H5页面、微场景制作平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.zybuluo.com/cmd/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/12c514efb877f3b6.png">Cmd Markdown</img></div>
                          <div class="card-desc">编辑阅读器，支持实时同步预览，区分写作和阅读模式，支持在线存储，分享文稿网址。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cli.im/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/aebdbbea9ede96e0.jpg">草料二维码</img></div>
                          <div class="card-desc">草料二维码是国内专业的二维码服务提供商，提供二维码生成、美化、印制、管理、统计等服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://tool.lu/css/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/77abd2f285a5e79e.png">CSS在线压缩工具</img></div>
                          <div class="card-desc">Css在线解压缩工具/整理/格式化。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.wjx.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/22c2a2474cd2b48a.jpg">问卷星</img></div>
                          <div class="card-desc">问卷星提供30多种题型，强大的统计分析功能，统计报告和原始答卷可免费下载。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://xiuxiu.web.meitu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/fbd44c2a62246d2a.jpg">美图秀秀网页版</img></div>
                          <div class="card-desc">美图秀秀 旗下图片处理软件中的在线版，不用下载直接使用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.wenjuan.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/bc99ec00a66a8082.jpg">问卷网</img></div>
                          <div class="card-desc">网络调查平台、问卷调查、市场调查、网络调查、表单设计。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://huaban.com/about/goodies/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/88dc363a15d31642.jpg">花瓣采集工具</img></div>
                          <div class="card-desc">你可以方便地保存任意网站上的图片、视频和截图。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://naotu.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/632c218a9be1576a.png">百度脑图</img></div>
                          <div class="card-desc">便捷的脑图编辑工具 - 控制创意，如此简单，让您在线上直接创建、保存并分享你的思路。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.mikecrm.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f68e886d2b0b9962.jpg">麦客CRM</img></div>
                          <div class="card-desc">麦客CRM是一款在线表单制作工具，同时也是强大的客户信息处理和关系管理系统。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.box3.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/bc650e2cab59ea12.png">开发工具箱</img></div>
                          <div class="card-desc">这个网站集合了各种工具，相信总有一款你用得上。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.processon.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6e97d3d79f7a604a.png">ProcessOn</img></div>
                          <div class="card-desc">ProcessOn是一个方便易用、免费高效的在线作图工具，运用它可以免费制作多种图。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://layerstyles.org/builder.html" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cd376cf0b62de942.png">Layer Styles</img></div>
                          <div class="card-desc">国外一个CSS3阴影在线生成器网站</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://kuaiqie.qdsay.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2131507ae6b2127a.png">勤道快切助手</img></div>
                          <div class="card-desc">在线网页切图工具，采用图片识别技术，在线切图转页面。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://card.qdsay.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/fbef7e16178c68aa.png">云配色</img></div>
                          <div class="card-desc">云配色 - 一键查询网页前端CSS、JS技术架构和配色方案。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-24">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>站长工具</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://www.google.com/webmasters/tools/home" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/40d1877f28a26509.jpg">Search Console</img></div>
                          <div class="card-desc">Google谷歌站长管理平台</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.miitbeian.gov.cn" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2261cfda22652bfa.png">备案管理系统</img></div>
                          <div class="card-desc">工业和信息化部ICP/IP地址/域名信息备案管理系统</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.bshare.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7de145a6da73a10b.gif">分享代码</img></div>
                          <div class="card-desc">中国最强大的社会化图文分享工具&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://union.sogou.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/917a39c50a1b7603.jpg">搜狗联盟</img></div>
                          <div class="card-desc">搜狗联盟向会员提供互联网流量变现业务服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://union.baidu.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/16912052bb3eb9f2.png">百度联盟</img></div>
                          <div class="card-desc">做网站必备的赚钱工具，审核较严格，需要备案，付款方便，但要扣税，广告种类多。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://check.links.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/59300f3a6a9031ee.gif">友情链接检测工具</img></div>
                          <div class="card-desc">即时了解哪些友情链接私自撤下链接，能自动识别JS链接、iframe链接等欺骗链接的方式，让站长轻松管理网站的友情链接。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://changyan.kuaizhan.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cc0020915d7a8013.png">畅言</img></div>
                          <div class="card-desc">专业的社会化评论系统，畅言是一个简单而强大的社会化评论及聚合平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.uyan.cc/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d68fcbe49cddef64.jpg">友言评论</img></div>
                          <div class="card-desc">专业网站社会化评论系统，一键同步评论留言分享到社交平台，实时采集SNS相关留言评论，迅速提升网站社会化流量。 </div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://developer.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/eeb02d5a01e756c5.png">百度开发者中心</img></div>
                          <div class="card-desc">汇聚、开放、助力、共赢，为开发者提供开发、推广、运营、变现一站式的服务体验。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.51.la/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c154166d0926cb25.png">51.la</img></div>
                          <div class="card-desc">我要啦，统计面向网站站长提供免费的、功能完善的、人性化的网站流量统计分析服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.umeng.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c0b63cf25815012d.jpg">友盟+</img></div>
                          <div class="card-desc">全球领先的第三方全域数据服务商，为客户提供PC/APP/线下统计等数据报告。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://tool.chinaz.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e3b0ef84337b39dd.png">站长工具</img></div>
                          <div class="card-desc">站长工具是站长的必备工具，经常上站长工具可以了解SEO数据变化。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.aizhan.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/eb449f3e369e83bd.png">爱站网</img></div>
                          <div class="card-desc">爱站网站长工具提供网站收录查询和站长查询以及百度权重值查询等多个站长工具。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://tongji.baidu.com/web/welcome/login" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dca8b1a9b69a4e4d.jpg">百度统计</img></div>
                          <div class="card-desc">百度统计——最大的中文网站分析平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.bing.com/toolbox/webmaster/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9512806953cde85d.png">必应站长平台</img></div>
                          <div class="card-desc">登录或注册必应网络管理员工具并提高您的网站在搜索时的性能。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://ziyuan.baidu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/38007e9b23b4a45d.png">百度搜索资源平台</img></div>
                          <div class="card-desc">全球最大的面向中文互联网管理者、移动开发者、创业者的搜索流量管理的官方平台。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-25">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>图片素材</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://699pic.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e4467da6a9d53894.png">摄图网</img></div>
                          <div class="card-desc">摄图网是一家专注正版摄影高清图免费下载的图库，免费用户每天只能下载一张图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.polayoutu.com/collections" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1c5dfecae738d0ce.jpg">泼辣有图</img></div>
                          <div class="card-desc">泼辣修图出的开源摄影网站，全部是无版权的摄影作品，所有图片可以用于任何用途。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.ssyer.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/95319067f6ed64a.png">别样网</img></div>
                          <div class="card-desc">无版权免费大尺寸图片共享平台，图片遵循CC0 协议，随时随地发布使用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://finda.photo/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/39f80b526256db78.png">Finda Photo</img></div>
                          <div class="card-desc">一个可以根据图片的颜色和图片标签以及来源的方式来搜索免费可商用的图片资源网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://trunklog.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/881f0fae1b270d38.png">Trunklog</img></div>
                          <div class="card-desc">瑞典的一位摄影师旅行所拍摄的照片，网站所有图片全部无偿使用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://cupcake.nilssonlee.se/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6c4154e8e8e2fac.png">Cupcake</img></div>
                          <div class="card-desc">免费无版权图库网站，所有图片采用CC0协议授权，图片色调厚实，适合做背景图。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.freemagebank.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8ac04b5aee47685e.png">freemagebank</img></div>
                          <div class="card-desc">免费的可商用的高清图库，图片质量很高，只是要注册才能下载图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.stockvault.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/554b01ea2a593448.png">Stockvault</img></div>
                          <div class="card-desc">Stockvault是一个免费图片分享站点，你可以在此站点注册成为会员，然后分享你喜爱的图片给其他用户。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.goodfreephotos.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9428d01d60c347da.png">Good Free Photos</img></div>
                          <div class="card-desc">大部分为摄影作品，也有少量的插图，右击保存图片就可以下载了。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://en.freejpg.com.ar/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/350a36bcb4998842.png">FreeJPG</img></div>
                          <div class="card-desc">免费的可商用的高清图库，可按颜色分类图片，超过1万张免费图片，质量非常高。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://skuawk.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/119abee93c0e150a.png">Skuawk</img></div>
                          <div class="card-desc">Skuawk 网站是一个集合了自由摄影师拍摄并分享的公共领域摄影图片，任何人都可以下载和使用这些图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://mystock.photos/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/f5ed36eac541dc8a.png">My Stock Photos</img></div>
                          <div class="card-desc">免费的可商用的高清图库，图片较少才490多张，但是图片质量非常不错，直接可以下载。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://alpha.wallhaven.cc/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c4842068b8b3a422.png">WallHaven</img></div>
                          <div class="card-desc">世界上最伟大的高清图库站WallBase复制版，原网站创办人失联后，前成员推出的测试版。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://picjumbo.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ef8329ede4e5273a.png">PicJumbo</img></div>
                          <div class="card-desc">一个叫维克多的人创办了这个基于网站设计的素材站点，因为每一个设计师都需要高质量的图片素材。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://mmtstock.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5991b3a22602e702.png">MMT</img></div>
                          <div class="card-desc">免费图库网站，图片使用CC0授权，网站图片色调比较亮丽，有很多花，也有很多 iPhone等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://jeshoots.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e0d4f893bef4edfa.png">JESHOOTS</img></div>
                          <div class="card-desc">2014年开始运营的免费无版权图片网站，图片质量还不错。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://stokpic.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/28d2e8e9179d309a.png">Stokpic</img></div>
                          <div class="card-desc">Stokpic 免费无版权图片素材库，支持自动把最新图片推送到邮箱。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://freelyphotos.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/367250db9eaf4c02.png">Freely Photos</img></div>
                          <div class="card-desc">国外一个基督教图片网站，有很多十字架，很多宗教祈祷的图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://source.pixite.co/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d5b45b9e5e9ee6fa.png">Pixite Source</img></div>
                          <div class="card-desc">可以搜索图片、材质、色调搜索，里面有很多比较精致的小众插图。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://photos.oliur.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4e1e7ff3258cfde2.png">Oliur Rahman</img></div>
                          <div class="card-desc">各种 iPhone、MacBook 和其他物件的好照片，直接可以下载，图片可免费商用。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://kaboompics.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d1853ac3dabd0d32.png">kaboompics</img></div>
                          <div class="card-desc">以生活化场景为主，比方说手机、日历之类的，也有一些 mockup，无需登录，直接下载。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.lifeofpix.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e38d6ce9a0215dba.png">LifeOfPix</img></div>
                          <div class="card-desc">免费无版权欧美生活图片网是一个提供免费高清图像素材，并且无版权限制，图片多为欧洲景观，多为摄影师拍摄的生活类图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://fancycrave.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dfcced79f9c0010a.png">FancyCrave</img></div>
                          <div class="card-desc">FancyCrave 网站是一个致力于个人和商业免费摄影图片资源库的站点。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://imcreator.com/free" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/83f2270f01d6b132.gif">IM FREE</img></div>
                          <div class="card-desc">免费高清图片库，该站提供搜索和分类目录,有人物、自然、艺术、生活、图标等分类。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://streetwill.co/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d10a269e51d73f0a.png">StreetWill</img></div>
                          <div class="card-desc">一个干净整洁无任何广告的图片分享网站，提供超高分辨率的图片资源，就是更新有点慢。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://visualhunt.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a10b0dfd84d83062.png">Visual Hunt</img></div>
                          <div class="card-desc">一个提供高品质免费图片素材的站点，收录了海量的CC0授权图片整合后生成的站点，用户可以通过内置的搜索引擎来查询海量的免费图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.hdwallpapers.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3406bd8986fba44a.png">HD wallpapers</img></div>
                          <div class="card-desc">免费高清壁纸图库，提供多种尺寸下载，图片商用需要作者许可哦&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://deathtothestockphoto.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/dce9b3894ef06a32.png">DEATH TO STOCK</img></div>
                          <div class="card-desc">高清免费图片网站，图片都是同系列多张打包好的压缩包，文件较大，注册成会员可以查看更多图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.designerspics.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e2980c1b1a0b6.png">DesignersPics</img></div>
                          <div class="card-desc">免费可以商用的图片网站，好图不多，需要花点时间才能找到自己喜欢的。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.pexels.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1ca2e92160969aee.png">Pexels</img></div>
                          <div class="card-desc">推荐&#65281;提供高清尺寸且品质优良的免费照片网站，直接可以下载，图片可用于任何用途。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://stocksnap.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2a8b0b37b90f75cb.png">StockSnap.io</img></div>
                          <div class="card-desc">高清免费大图素材，不用登陆直接可以下载，每周更新超过百张高清免费图片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.socwall.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a26b487477325c05.png">Socwall</img></div>
                          <div class="card-desc">高清免费图库，不用登陆直接可以下载，风景类图片居多。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://barnimages.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5c016634a377c0ad.png">Barn Images</img></div>
                          <div class="card-desc">这些相片看起来确实跟一般的图库相片很不一样，不但很有质感，也少了一种制式的感觉。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://publicdomainarchive.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7f2d171ac5943a21.jpg">publicdomain</img></div>
                          <div class="card-desc">publicdomainarchive目前已经有33万张免费高清图像下载，设计师可以免费使用在你的创意项目上。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://foodshot.co/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e3970dbc703f76af.png">Foodshot</img></div>
                          <div class="card-desc">美食主题图库，图片质量都比较高，图片点击下载然后另存为就可以了。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://cn.freeimages.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d29d566949bb447.png">FAMILYSAFE</img></div>
                          <div class="card-desc">超高清免费图库，超过30万张免费高清图片，注册登录后直接可以下载&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://unsplash.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8419b1366cffa9d9.png">Unsplash</img></div>
                          <div class="card-desc">Unsplash - 美丽，免费的照片，高质量图库，同样不用登陆直接下载。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://magdeleine.co/browse/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4605b0938044e895.png">Magdeleine</img></div>
                          <div class="card-desc">高清灵感图片资源下载,免费的哦，不用登录即可直接点击下载。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.gratisography.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4340a862ab0d6c81.png">Gratisography</img></div>
                          <div class="card-desc">Gratisography-超高清优质可商用图库，各种创意图片，图片可用于商业用途。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://pixabay.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/302447bfcb844997.png">Pixabay</img></div>
                          <div class="card-desc">全球最大的免费可商用高清图库网站，超过130万张免费的优质图片及视频素材。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-26">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>精选酷站</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://www.bandari.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/1ea8b3692766aec.png">班得瑞全球网</img></div>
                          <div class="card-desc">一个设计非常好看的音乐网站，聆听大自然赐于我们的天籁之音。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.dowebok.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/756e7a769461b9cc.png">dowebok</img></div>
                          <div class="card-desc">dowebok - 做好网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.5iweb.com.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/60e26c1caf386480.png">5iweb</img></div>
                          <div class="card-desc">专注于HTML5、CSS3、js、jQuery、手机移动端等网页特效的手机与分享。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://allthefreestock.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b518ab2ac584a3d4.png">AllTheFreeStock</img></div>
                          <div class="card-desc">一个地址，找到所有无版权图片、模型、视频、声效、配色、网页模板、字体、图标、邮件模板&#8230;&#8230;简直就是懒人福音&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://seanhalpin.io/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9f342becc4389192.png">Sean Blog</img></div>
                          <div class="card-desc">一个在加拿大的优秀的网页设计/前端，对网页设计和喜爱为网络和移动设备创造了热情。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://placeit.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2907a82ecf976ece.png">Placeit</img></div>
                          <div class="card-desc">在线生成原型模板网站，有可点击的交互、视频、照片。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://720yun.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/5c81380a87354970.png">720云VR社区</img></div>
                          <div class="card-desc">720云VR社区，是中国最大的VR创作者社区和虚拟现实内容平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.iiiimg.com/#" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2bb5446dabba05dc.png">全球酷站中心</img></div>
                          <div class="card-desc">同步更新全球html5网站，很适合学习最新网站设计趋势。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-27">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>互联网资讯</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://www.pingwest.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/48498d61cd269a02.png">PingWest品玩</img></div>
                          <div class="card-desc">PingWest以提供最前沿科技创业资讯、趋势和洞见为主，是连接海外与国内的新锐在线科技媒体。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.tmtpost.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/26bda9661aa906e.PNG">钛媒体</img></div>
                          <div class="card-desc">钛媒体是国内首家TMT公司人社群媒体，集信息交流融合、IT技术信息、新媒体于一身的媒体平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.cnbeta.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8df3ba51a4272ae6.jpg">cnBeta</img></div>
                          <div class="card-desc">cnBeta.COM是互联网IT新闻业界的后起之秀,是国内领先的即时科技资讯站点和网友交流平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://tech2ipo.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6a7562a897a4953c.png">创见</img></div>
                          <div class="card-desc">TECH2IPO创见专注互联网创业与创新，我们报道最前沿的科技创业模式，披露最有潜力的新兴创业公司。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.infoq.com/cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8e32c29c02eff1b4.jpg">InfoQ</img></div>
                          <div class="card-desc">InfoQ是一个在线新闻/社区网站，旨在通过促进软件开发领域知识与创新的传播，为软件开发者提供帮助。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.cyzone.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/47bb62c41b1b293c.jpg">创业邦</img></div>
                          <div class="card-desc">中国领先的专业创业服务平台，致力于帮助创业者实现创业梦想，推动各领域高成长企业快速发展。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.huxiu.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/fb749473aa1337ae.jpg">虎嗅网</img></div>
                          <div class="card-desc">创办于2012年5月，虎嗅网是一个聚合优质创新信息与人群的新媒体平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.ifanr.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7c8a8c24130ea0fc.png">爱范儿</img></div>
                          <div class="card-desc">爱范儿是发现创新价值的科技媒体，是MobileMonday 广州授权组织者，成立于 2008 年 10 月。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.geekpark.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/cbf5c3a6d68e6a3c.jpg">极客公园</img></div>
                          <div class="card-desc">聚焦互联网领域，跟踪最新的科技新闻动态，关注极具创新精神的科技产品。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://36kr.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6ebf1d17ca75df16.png">36氪</img></div>
                          <div class="card-desc">36氪创办于2011年7月，36氪以科技创投媒体起家，是中国主流、权威和影响力最大的新商业媒体。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-28">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>工作/私单</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="https://mart.coding.net/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c86881d939dc87d4.jpg">码市</img></div>
                          <div class="card-desc">互联网软件外包服务平台，码市是 Coding 推出的互联网软件外包服务平台，意在连接需求方与广大开发者。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.job5156.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6894e26f1f7d7b9e.jpg">智通人才网</img></div>
                          <div class="card-desc">智通人才网提供“线上&#43;线下”O2O招聘模式，为企业提供网络招聘、招聘会、校园招聘，致力于实现企业和人才的高效对接。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.58.com/changecity.html?" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4c6f676329a1abe0.jpg">58同城招聘</img></div>
                          <div class="card-desc">58同城成立于2005年，网站定位于本地社区及免费分类信息服务，帮助人们解决生活和工作所遇到的难题。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.ganji.com/zhaopin/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3e1cf10d8e2e99ca.jpg">赶集网</img></div>
                          <div class="card-desc">赶集网成立于2005年，是专业的分类信息网，为用户提供房屋租售、招聘求职、交友等众多本地生活及商务服务。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.wealink.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a1b81d19aaa2868e.jpg">若邻网</img></div>
                          <div class="card-desc">若邻网拥有数百万高端职业人士会员，且保持高速增长，是目前全球最大的中文商务社交网。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.kanzhun.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a1c5fcb59a065b4e.jpg">看准网</img></div>
                          <div class="card-desc">看准网&#65288;Kanzhun&#65289;是中国雇主点评与职场信息平台，网站成立于2013年12月，2016年上线看准APP。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.dajie.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2cc314c63a3c922.jpg">大街网</img></div>
                          <div class="card-desc">大街网创立于2008年底，是一家真正专属于年轻人的移动社交招聘平台，为年轻职场人匹配最佳工作机会。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.chinahr.com" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/904561315addcef2.jpg">中华英才网</img></div>
                          <div class="card-desc">中华英才网成立于1997年，是国内最早、最专业的人才招聘网站之一，其品牌和服务已被个人求职者和企业人力资源部门普遍认可。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.51job.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b9f0943eb841dafe.jpg">前程无忧</img></div>
                          <div class="card-desc">前程无忧&#40;Nasdaq: JOBS&#41;是国内一个集多种媒介资源优势的专业人力资源服务机构，创始人为甄荣辉。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.zhaopin.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7f6016bc972ef9be.jpg">智联招聘</img></div>
                          <div class="card-desc">智联招聘创建于1997年，是一家面向大型公司和快速发展的中小企业提供一站式专业人力资源服务，包括网络招聘等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.nowcoder.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/e6e052bea268163a.jpg">牛客网</img></div>
                          <div class="card-desc">“牛客网”是一个专注于程序员的学习和成长的专业平台，集笔面试系统、课程教育、社群交流、招聘内推于一体。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.neitui.me/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/a43678726d7c1e90.png">内推网</img></div>
                          <div class="card-desc">内推网是一个专注于互联网行业的招聘平台，致力于打造互联网招聘第一品牌。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.genduiren.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/b3350fe5961961e8.png">跟对人</img></div>
                          <div class="card-desc">跟对人是一个招聘信息网站平台，提供互联网it公司最新招聘信息，是互联网人才求职找工作首选网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.dianhou.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d912931e951c49f8.jpg">电猴网</img></div>
                          <div class="card-desc">电猴网是一个为电子商务、互联网it行业的企业及人才提供求职招聘信息展示的平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.liepin.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/58b4a03489b4dd5a.jpg">猎聘网</img></div>
                          <div class="card-desc">猎聘网于2011年上线，是国内唯一真正实现企业、猎头和职业经理人三方互动的职业发展平台。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.nashangban.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/51b866cb7407d832.png">哪上班</img></div>
                          <div class="card-desc">哪上班招聘网是专注优质互联网招聘平台，高薪工作、企业直招、公司内推、内部推荐直接面试。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.lagou.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/7cae325e3e75e932.jpg">拉勾网</img></div>
                          <div class="card-desc">拉勾网，是一家专为拥有3至10年工作经验的资深互联网从业者，提供工作机会的招聘网站。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://cn.100offer.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d07b8d2292c9150.png">100offer</img></div>
                          <div class="card-desc">让最好的人才遇见更好的机会，100offer上线于2014年7月12日，致力于“为最好的程序员发现更好的offer”。</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section><section class="item card-box" id="row-29">
              <div class="container-fluid">
                <div class="row">
                  <div class="item-tit">
                    <strong><i class="icon icon-user"></i>应用程序</strong>
                  </div>
                  
                  <div class="clearfix ">
                    <div class="col-md-3 col-xs-6">
                        <a href="http://app.mi.com/subject/169216" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/88f41ad12a9f03c0.jpg">小米 - 金米奖</img></div>
                          <div class="card-desc">金米奖评选的应用都是近2周内最佳的应用和游戏，评选的应用和游戏都富有当前的流行元素或反应即将流行的趋势。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.wandoujia.com/award" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/bf792f5b3abb06ac.png">豌豆荚设计奖</img></div>
                          <div class="card-desc">优质安卓应用，每周推荐一次，快来豌豆荚设计奖看看，让实用、创意、或经典的安卓应用填满您的手机吧。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.ttrar.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/d6405076489a0fa4.png">天天软件</img></div>
                          <div class="card-desc">天天下载是个免费软件下载网站，纯净用户体验,没有垃圾广告的单机游戏和软件下载基地&#33;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.dayanzai.me/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8715517a8eb33b54.png">大眼仔旭</img></div>
                          <div class="card-desc">大眼仔旭博客提供各类PC软件、绿色软件、手机游戏、安卓APP等，坚持每天更新大量软件及视频教程。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.iplaysoft.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/c4a6327de47bcb6e.jpg">异次元软件世界</img></div>
                          <div class="card-desc">很有特色的软件博客&#65281;推荐精选实用的软件，并提供相当详细且精美的图文评测。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.portablesoft.org/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/9b5c2620d9469d1e.jpg">精品绿色便携软件</img></div>
                          <div class="card-desc">追求绿色便携理念，打造清爽干净系统&#65281;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://bbs.kafan.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/8df08956166d1cce.jpg">卡饭论坛</img></div>
                          <div class="card-desc">是国内最著名的软件论坛、友善,、热情、开放的讨论氛围、首屈一指，打造国内最好的软件交流平台&#33;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.repaik.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/2f6f63ab04a48b3e.png">睿派克技术论坛</img></div>
                          <div class="card-desc">软件去广告论坛，破解软件限制，破解迅雷VIP，去广告，提供方法教程，以及精品软件下载，最新高清电影等。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.appinn.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ed1a8edb6ba678d0.png">小众软件</img></div>
                          <div class="card-desc">小众软件这里分享免费、小巧、实用、有趣、绿色的软件。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.flighty.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/ebc4fbf309335400.png">轻狂志</img></div>
                          <div class="card-desc">要分享少轻狂原创或整理的NSIS源码,以及软件封装方面的相关知识。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.qiuquan.cc/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/4392e9e1369704a4.png">QiuQuan</img></div>
                          <div class="card-desc">QiuQuan Blog 是一个精品软件分享博客,专注于软件的绿化、精简与优化。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://www.zdfans.com/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/696788ab7c53ceb0.png">zd423</img></div>
                          <div class="card-desc">软件分享平台领跑者 ZDFANS.COM,更新快、去广告类软件博客领跑者、有态度的知名软件分享站&#33;</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="https://www.52pojie.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/3ef1ffb5747c3b82.jpg">吾爱破解</img></div>
                          <div class="card-desc">爱破解英文全称 Love Crack Group，缩写LCG吾爱破解论坛是致力于软件安全与病毒分析的非营利性技术论坛。</div>
                        </a>
                      </div><div class="col-md-3 col-xs-6">
                        <a href="http://msdn.itellyou.cn/" class="card-link" target="_blank">
                          <div class="card-tit"><img src="/upload/images/2018/4/6313b317a505c5e6.png">MSDN我告诉你</img></div>
                          <div class="card-desc">一个原版软件信息收录站点，该网站创办十年仍是非常简洁的风格，没有广告&#65281;</div>
                        </a>
                      </div>
                  </div>
                </div>
              </div>
            </section>
          -->
        </div>
        <!--页脚-->
        <footer class="footer">
  <div class="container">
    <div class="rwo">
      <div class="col-md-12">
        <p>本站内容采自互联网，如果某些内容侵犯了你的权益，请立即联系我，我将尽快删除相关内容，联系邮箱：1371096680@qq.com</p>
        <p>Copyright © 2017-2018 小呆导航（webjike.com）All Rights Reserved</p>
      </div>
    </div>
  </div>
</footer>
      </div><!--内容区域-->
    </div>
    <div id="get-top" title="回到顶部"><i class="icon icon-arrow-up"></i></div>
    <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1261855216'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s11.cnzz.com/z_stat.php%3Fid%3D1261855216' type='text/javascript'%3E%3C/script%3E"));</script>
    <!--[if lt IE 9]>
    <script src="dist/lib/ieonly/html5shiv.js"></script>
    <script src="dist/lib/ieonly/respond.js"></script>
    <![endif]-->
    <!-- jQuery (ZUI中的Javascript组件依赖于jQuery) -->
    <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
    <!-- ZUI Javascript组件 -->
    <script src="/dist/js/zui.js"></script>
    <script src="/layer/layer.js"></script>
    <script src="/js/js.js"></script>
  </body>
</html>

